<script setup lang="ts">
import dayjs from 'dayjs';

const router = useRouter()
const route = useRoute()
const obj = ref()
const qfr = ref()
const date = ref()
const products = ref()
const pList = ref()
const totalPrice = ref()
const oid = ref()
const money = ref()

const gotoPay = () => {
  router.push({ path: '/qifu/pay', query: { oid: oid.value, date: date.value, money: money.value} })
}

const orderInfo = async () => {
  oid.value = route.query.oid
  const {data:res} = await useFetchPost('/api/Orders/getOrderInfo', {
        oid: oid.value,
  })
  return res.value.data
}

onMounted(async () => {
  const info = await orderInfo()
  money.value = info.money
  products.value = info.data.productId
  //如果products数组为空
  if (products.value.length <= 0) {
    return
  }
  const {data:res} = await useFetchPost('/api/Product/getProductsList', {
        productIds: products.value,
  })
  pList.value = res.value.data.list
  //相加pList.value每个元素的price
  totalPrice.value = pList.value.reduce((sum:any, item:any) => Number(sum) + Number(item.price), 0);
  qfr.value = info.data.qfr
  obj.value = info.data.obj.label
  var userBirthdate = dayjs(info.data.date as string).format('YYYY-MM-DD HH:mm:ss')
  // console.log(userBirthdate)
  var date1 = userBirthdate.split(' ')[0]
  var date2 = userBirthdate.split(' ')[1]
  var date1Array = date1?.split('-') || []
  var y = Number(date1Array[0] || 0)
  var m = Number(date1Array[1] || 0)
  var d = Number(date1Array[2] || 0)
  var ys = y
  var ms = m
  var ds = d
  var date2Array = date2?.split(':') || []
  var h = Number(date2Array[0] || 0)
  var i = Number(date2Array[1] || 0)
  // console.log(ys, ms, ds, h, i)
  m = m - 1;
  d = d - 1;

  var cY, cM, cD, cH;
  if (m < 2) cY = y - 1900 + 36 - 1;
  else cY = y - 1900 + 36;
  var term2 = sTerm_d(y, 2);
  if (m == 1 && (d + 1) > term2) cY = y - 1900 + 36;
  if (m == 1 && (d + 1) == term2 && (h * 60 + i) >= sTerm_hi(y, 2)) cY = y - 1900 + 36;
  var firstNode = sTerm_d(y, m * 2);
  cM = (y - 1900) * 12 + m + 12;
  var start_term = (Date.UTC(y, m, d + 1, h, i, 0, 0) - Number(sTerm_s(y, m * 2 - 2))) / 1000;
  var start_term1 = wzc(y, m * 2 - 2);
  if (m == 0) {
    start_term = (Date.UTC(y, m, d + 1, h, i, 0, 0) - Number(sTerm_s(y - 1, 22))) / 1000;
    start_term1 = wzc(y - 1, 22);
  }
  var end_term = (Number(sTerm_s(y, m * 2)) - Date.UTC(y, m, d + 1, h, i, 0)) / 1000;
  var end_term1 = wzc(y, m * 2);
  if ((d + 1) > firstNode || ((d + 1) == firstNode && (h * 60 + i * 1) >= sTerm_hi(y, m * 2))) {
  cM = (y - 1900) * 12 + m + 13;
  start_term = (Date.UTC(y, m, d + 1, h, i, 0, 0) - Number(sTerm_s(y, m * 2))) / 1000;
  start_term1 = wzc(y, m * 2);
  end_term = (Number(sTerm_s(y, m * 2 + 2)) - Date.UTC(y, m, d + 1, h, i, 0)) / 1000;
  end_term1 = wzc(y, m * 2 + 2);
  if (m == 11) {
    end_term = (Number(sTerm_s(y + 1, 0)) - Date.UTC(y, m, d + 1, h, i, 0, 0)) / 1000;
    end_term1 = wzc(y + 1, 0);
  }
  }
  if (start_term < 0) start_term = 0;
  if (end_term < 0) end_term = 0;
  var dayCyclical = Date.UTC(y, m, 1, 0, 0, 0, 0) / 86400000 + 25567 + 10;
  cD = dayCyclical + d;
  if (h >= 23) cD = dayCyclical + d + 1;
  var nh;
  if (h == 23 || h == 1 || h == 3 || h == 5 || h == 7 || h == 9 || h == 11 || h == 13 || h == 15 || h == 17 || h == 19 || h == 21) {
    nh = h - 1;
    nh = nh + 2;
  } else {
    nh = h;
  }
  var houseCyclical = (Date.UTC(y, m, d + 1, nh, 0, 0, 0) / 3600000 + 25567 * 24) / 2;
  cH = houseCyclical;
	
  var lDate = lll(y, m, d, h);
  date.value = date1 + "  " + lDate
})

const lunarInfo = new Array(
	0x4bd8, 0x4ae0, 0xa570, 0x54d5, 0xd260, 0xd950, 0x5554, 0x56af, 0x9ad0, 0x55d2, 0x4ae0, 0xa5b6, 0xa4d0, 0xd250, 0xd295, 0xb54f, 0xd6a0, 0xada2, 0x95b0, 0x4977, 0x497f, 0xa4b0, 0xb4b5, 0x6a50, 0x6d40, 0xab54, 0x2b6f, 0x9570, 0x52f2, 0x4970, 0x6566, 0xd4a0, 0xea50, 0x6a95, 0x5adf, 0x2b60, 0x86e3, 0x92ef, 0xc8d7, 0xc95f, 0xd4a0, 0xd8a6, 0xb55f, 0x56a0, 0xa5b4, 0x25df, 0x92d0, 0xd2b2, 0xa950, 0xb557, 0x6ca0, 0xb550, 0x5355, 0x4daf, 0xa5b0, 0x4573, 0x52bf, 0xa9a8, 0xe950, 0x6aa0, 0xaea6, 0xab50, 0x4b60, 0xaae4, 0xa570, 0x5260, 0xf263, 0xd950, 0x5b57, 0x56a0, 0x96d0, 0x4dd5, 0x4ad0, 0xa4d0, 0xd4d4, 0xd250, 0xd558, 0xb540, 0xb6a0, 0x95a6, 0x95bf, 0x49b0, 0xa974, 0xa4b0, 0xb27a, 0x6a50, 0x6d40, 0xaf46, 0xab60, 0x9570, 0x4af5, 0x4970, 0x64b0, 0x74a3, 0xea50, 0x6b58, 0x5ac0, 0xab60, 0x96d5, 0x92e0, 0xc960, 0xd954, 0xd4a0, 0xda50, 0x7552, 0x56a0, 0xabb7, 0x25d0, 0x92d0, 0xcab5, 0xa950, 0xb4a0, 0xbaa4, 0xad50, 0x55d9, 0x4ba0, 0xa5b0, 0x5176, 0x52bf, 0xa930, 0x7954, 0x6aa0, 0xad50, 0x5b52, 0x4b60, 0xa6e6, 0xa4e0, 0xd260, 0xea65, 0xd530, 0x5aa0, 0x76a3, 0x96d0, 0x4afb, 0x4ad0, 0xa4d0, 0xd0b6, 0xd25f, 0xd520, 0xdd45, 0xb5a0, 0x56d0, 0x55b2, 0x49b0, 0xa577, 0xa4b0, 0xaa50, 0xb255, 0x6d2f, 0xada0, 0x4b63, 0x937f, 0x49f8, 0x4970, 0x64b0, 0x68a6, 0xea5f, 0x6b20, 0xa6c4, 0xaaef, 0x92e0, 0xd2e3, 0xc960, 0xd557, 0xd4a0, 0xda50, 0x5d55, 0x56a0, 0xa6d0, 0x55d4, 0x52d0, 0xa9b8, 0xa950, 0xb4a0, 0xb6a6, 0xad50, 0x55a0, 0xaba4, 0xa5b0, 0x52b0, 0xb273, 0x6930, 0x7337, 0x6aa0, 0xad50, 0x4b55, 0x4b6f, 0xa570, 0x54e4, 0xd260, 0xe968, 0xd520, 0xdaa0, 0x6aa6, 0x56df, 0x4ae0, 0xa9d4, 0xa4d0, 0xd150, 0xf252, 0xd520)


const nStr1 = new Array('零', '一', '二', '三', '四', '五', '六', '七', '八', '九', '十')
const nStr2 = new Array('初', '十', '廿', '卅')
const monthName = new Array("", "正", "二", "三", "四", "五", "六", "七", "八", "九", "十", "十一", "十二")


const lYearDays = (y: number) => {
    var i, sum = 348;
    for (i = 0x8000; i > 0x8; i >>= 1) sum += (lunarInfo[y - 1900]! & i) ? 1 : 0;
    return (sum + leapDays(y));
}

const leapDays = (y:number) => {
    if (leapMonth(y)) return ((lunarInfo[y - 1899]! & 0xf) == 0xf ? 30 : 29);
    else return (0);
}

function leapMonth(y:number) {
    var lm = lunarInfo[y - 1900]! & 0xf;
    return (lm == 0xf ? 0 : lm);
}

const monthDays = (y:number, m:number) => {
    return ((lunarInfo[y - 1900]! & (0x10000 >> m)) ? 30 : 29);
}

const year = ref()

const month = ref()

const day = ref()

const isLeap = ref()

const Lunar = (objDate: Date) => {
    var i, leap = 0,
        temp = 0;
    var offset = (Date.UTC(objDate.getFullYear(), objDate.getMonth(), objDate.getDate()) - Date.UTC(1900, 0, 31)) / 86400000;
    if (objDate.getHours() >= 23) {
        offset++;
    }
    for (i = 1900; i < 2100 && offset > 0; i++) {
        temp = lYearDays(i);
        offset -= temp;
    }
    if (offset < 0) {
        offset += temp;
        i--;
    }
    year.value = i;
    leap = leapMonth(i);
    isLeap.value = false;
    for (i = 1; i < 13 && offset > 0; i++) {
        if (leap > 0 && i == (leap + 1) && isLeap.value == false) {
            --i;
            isLeap.value = true;
            temp = leapDays(year.value);
        } else {
            temp = monthDays(year.value, i);
        }
        if (isLeap.value == true && i == (leap + 1)) isLeap.value = false;
        offset -= temp;
    }
    if (offset == 0 && leap > 0 && i == leap + 1) if (isLeap.value) {
        isLeap.value = false;
    } else {
        isLeap.value = true;
        --i;
    }
    if (offset < 0) {
        offset += temp;
        --i;
    }
    month.value = i;
    day.value = offset + 1;
}

const cYear = (y:number) => {
    var s;
    s = nStr1[Math.floor(y / 1000)];
    s += nStr1[Math.floor((y % 1000) / 100)]!;
    s += nStr1[Math.floor((y % 100) / 10)]!;
    s += nStr1[y % 10]!;
    return (s);
}

const cDay = (d:number) => {
    var s;
    switch (d) {
    case 10:
        s = '初十';
        break;
    case 20:
        s = '二十';
        break;
        break;
    case 30:
        s = '三十';
        break;
        break;
    default:
        s = nStr2[Math.floor(d / 10)];
        s += nStr1[d % 10]!;
    }
    return (s);
}

const lll = (y:number, m:number, i:number, h:number) => {
    var hh=["00:00-00:59早子", "01:00-01:59丑", "02:00-02:59丑", "03:00-03:59寅", "04:00-04:59寅", "05:00-05:59卯", "06:00-06:59卯", "07:00-07:59辰", "08:00-08:59辰", "09:00-09:59巳", "10:00-10:59巳", "11:00-11:59午", "12:00-12:59午", "13:00-13:59未", "14:00-14:59未", "15:00-15:59申", "16:00-16:59申", "17:00-17:59酉", "18:00-18:59酉", "19:00-19:59戌", "20:00-20:59戌", "21:00-21:59亥", "22:00-22:59亥", "23:00-23:59晚子"];
    var sDObj = new Date(y, m, i + 1, h);
    var lDObj = Lunar(sDObj);
    var lY = cYear(year.value);
    var lM = monthName[month.value];
    var lD = cDay(day.value);
    var lL = isLeap.value ? '闰' : '';
    if(h>=0 && h<24){
        var lS = hh[h] as string;
    }else{
        var lS = '未知';
    }
    var lH = isLeap.value ? '闰' : '';
    
  // return (lY + '年' + lL + lM + '月' + lD + '日' + ' '+lS+'时' )
    return (lY + '年' + lL + lM + '月' + lD + '日')
}

const sTermInfo: number[] = [0, 21198, 42461, 63813, 85308, 106961, 128806, 150834, 173055, 195433, 217965, 240558, 263215, 285853, 308440, 330912, 353245, 375400, 397371, 419149, 440750, 462193, 483513, 504747];

const wzc = (year: number, num: number) => {
    var objD = new Date((31556956000 * (year - 1882) + sTermInfo[num]! * 60000) + Date.UTC(1882, 0, 5, 18, 0));
    var hh = objD.getUTCHours();
    var mm = objD.getUTCMinutes();
    var ss = objD.getUTCSeconds();
    var s = num + '/(' + (objD.getUTCMonth() + 1) + "月" + objD.getUTCDate() + "日" + hh + ":" + mm + ')';
    return (s);
}

const sTerm_d = (y:number, n:number) => {
    var offDate = new Date((31556956000 * (y - 1882) + sTermInfo[n]! * 60000) + Date.UTC(1882, 0, 5, 18, 0));
    return (offDate.getUTCDate());
}

const sTerm_hi = (y:number, n:number) => {
    var offDate = new Date((31556956000 * (y - 1882) + sTermInfo[n]! * 60000) + Date.UTC(1882, 0, 5, 18, 0));
    var hi = offDate.getUTCHours() * 60 + offDate.getUTCMinutes();
    return (hi);
}

const sTerm_s = (y: number, n: number) => {
    var offDate = new Date((31556956000 * (y - 1882) + sTermInfo[n]! * 60000) + Date.UTC(1882, 0, 5, 18, 0));
		return (offDate);
}
</script>

<template>
  <div class="w-full min-h-screen relative">
    <Header :back="'/qifu'" />
    <!-- 自适应背景图 -->
    <img 
    src="/assets/images/qifu/feiyongye.png" 
    alt=""
    class="w-full h-auto object-contain"
    />
    <div class="absolute w-full flex justify-center top-[25%] z-1">
      <div class="relative w-full h-full">
        <div>
          <div class="text-[#99221b] font-bold flex justify-start pl-[10%] mb-[5%]">
            <span>我是祈福人：</span>
            <span>{{qfr}}</span>
          </div>
          <div class="text-[#99221b] font-bold flex justify-start pr-[10%] pl-[10%] mb-[5%]">
            <span>于&nbsp;&nbsp;{{date}}&nbsp;{{obj}}</span>
          </div>
        </div>
        <div class="relative w-[85%] left-0 right-o mx-auto mb-[5%]">
          <img 
          src="/assets/images/qifu/detail.png" 
          alt=""
          class="w-full h-auto object-contain"
          />
          <div>
            <div class="absolute w-full top-[15%] flex justify-center items-center">
              <div class="relative w-full">
                <div v-for="p in pList" class="text-[#99221b] mb-[5%] font-bold" :key="p.id">
                  <div class="flex justify-around">
                    <span>
                      {{p.name}}
                    </span>
                    <span>
                      ¥{{p.price}}
                    </span>
                  </div>
                </div>
                
              </div>
            </div>
            
          </div>
        </div>
        
        <div class="relative w-[85%] left-[5%] right-o mx-auto mb-[5%] text-[#99221b] font-bold">
          <span>合计：¥{{ totalPrice }}</span>
        </div>
      </div>
    </div>

    <button class="absolute left-0 right-0 mx-auto bottom-[25%] w-[150px] md:w-[170px] cursor-pointer opacity-90 hover:opacity-100 transition-opacity" @click="gotoPay">
        <img 
        src="/assets/images/qifu/submit.png" 
        alt=""
        />
    </button>
  </div>
</template>


